<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h2>表单标签</h2>
    <!-- form 就是一个容器 -->
     <form action="">
        <!-- input 
         通过 type 设置不同的外观 
        -->
         <div>
            <input type="text" name="" id="" placeholder="输入用户名">
         </div>
         <div>
            <input type="password" name="" id="" placeholder="输入密码">
         </div>
         <div>
            <!-- 想通的 name 让浏览器知道是一组 -->
             <!-- label  for 关联指定标签的 id 属性,可以实现点字,等同于点标签 -->
            <label for="boy">男</label><input type="radio" name="male" id="boy">
            <label for="girl">女</label><input type="radio" name="male" id="girl">
            <label for="secrrt">保密</label><input type="radio" name="male" id="secrrt">
         </div>
         <div>
            <!-- value 获取到的是数据,label 中放置的是给用户看的数据 -->
            <label for="basketball">篮球</label>
            <input id="basketball" type="checkbox" value="1">
            <label for="sing">唱</label>
            <input id="sing" type="checkbox" value="2">
            <label for="dance">跳</label>
            <input id="dance" type="checkbox" value="3">
            <label for="rap">rap</label>
            <input id="rap" type="checkbox" value="4">
         </div>
         <div>
            <!-- 文本域 -->
             <textarea placeholder="个性签名" name="" id=""></textarea>
         </div>
         <div>
            <!-- type 设置按钮的类型
             button 默认
             submit 提交,可以结合 form 表单 提交数据到指定的 url 地址
             reset 重置表单,重置的是,所在 form 标签内部的元素
              -->
             <button type="submit">提交</button>
             <button type="reset">重置</button>
         </div>
     </form>
     <h2>搜索</h2>
     <!-- 自己写个搜索引擎 -->
      <form action="https://baidu.com/s">
      <input type="text" placeholder="输入查询的内容" name="wd">
      <button type="submit">去搜索</button>
    </form>
</body>
</html>